<!DOCTYPE html>
<html class="hybrid" data-dpr="2" style="font-size: 75px;">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>首页</title>
    <meta name="viewport" content="width=device-width, initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=0">
    <!-- 电话号码不被显示为超链接 -->
    <meta content="telephone=no" name="format-detection" />
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-cache">
    <meta http-equiv="Expires" content="0">
    <!-- UC强制全屏 -->
    <meta name="full-screen" content="yes">
    <!-- QQ强制全屏 -->
    <meta name="x5-fullscreen" content="true">
    <link href="./static/css/index.2525f9504888eb93733ed3ab5519e5e3.css" rel="stylesheet">
    <link rel="stylesheet" href="./static/css/animate.css">
    <link rel="stylesheet" href="./static/css/com.css">
    <link rel="stylesheet" href="./static/css/swiper.min.css">
    <link rel="stylesheet" href="./static/css/index.css">
    <link rel="stylesheet" href="./static/css/test.css">
</head>

<body style="font-size: 24px;">
    <div class="index" id='index-app'>
        <div>

            <hea-controll :icon_json='heaIconJson' @right1='right1' @right2='right2'></hea-controll>

            <!-- 恭喜你成为会员，快去看看会员的专属优惠把 -->
            <gou-out-controll ref='becomeVip' :go_out_data='becomeVipFont' @sure='sureBecomeVip'></gou-out-controll>
            <!-- 恭喜你成为会员，快去看看会员的专属优惠把 -->

            <!-- 立即领取 -->
            <div>
                <div id='mask' style='z-index:102' v-if='receiveShow'></div>

                <transition enter-active-class='animated bounceIn' leave-active-class='animated bounceOut'>
                    <div v-if='receiveShow' class='go-out-com'>
                        <div class='close-notice-com' style='height:auto;'>
                            <div class='close-img-com' @click='receiveShow=false;'></div>
                            <div class='close-show-hua-com'>
                                <img src='./static/img/index-aeceive.png' width='210px' height="366px" />
                            </div>
                            <div class='index-huajia-img'>
                                <img src="./static/img/index-huajia.png" width="120px" height="45px">
                                <img src="./static/img/vip-card.png" width="114px" height="35px">
                            </div>
                            <div class='input-veceive-wrap'>
                                <input class='input-com' type="text" placeholder="请输入您的手机号码" v-model='userInfo.phone'>
                                <div class='have-invita'>
                                    <input class='input-com' type="text" placeholder="请输入验证码" v-model='userInfo.invita'>
                                    <span @click='getInvi' v-text='getInviFont'>获取验证码</span>
                                </div>
                            </div>
                            <div class='close-btn-sure' style='padding-bottom:40px;'>
                                <button @click='goReceive("get")'>立即领取</button>
                            </div>
                        </div>
                    </div>
                </transition>
            </div>
            <!-- 立即领取 -->

            <!-- 进入花迦 -->
            <div>
                <div id='mask' style='z-index:102' v-if='goInHuajia'></div>
                <transition enter-active-class='animated bounceIn' leave-active-class='animated bounceOut'>
                    <div v-if='goInHuajia' class='go-out-com'>
                        <div class='close-notice-com' style='height:auto;'>
                            <div class='close-img-com' @click='goInHuajia=false;'></div>
                            <div class='close-show-hua-com'>
                                <img src='./static/img/index-aeceive.png' width='210px' height="366px" />
                            </div>
                            <div class='index-huajia-img'>
                                <img src="./static/img/index-huajia.png" width="120px" height="45px">
                                <img src="./static/img/vip-card.png" width="114px" height="35px">
                            </div>
                            <div class='input-veceive-wrap'>
                                <input class='input-com' type="text" placeholder="请输入您的手机号码" v-model='userInfo.phone'>
                                <div class='have-invita'>
                                    <input class='input-com' type="text" placeholder="请输入验证码" v-model='userInfo.invita'>
                                    <span @click='getInvi' v-text='getInviFont'>获取验证码</span>
                                </div>
                            </div>
                            <div class='close-btn-sure' style='padding-bottom:40px;'>
                                <button @click='goReceive("in")'>进入花迦</button>
                            </div>
                            <div class='sanfang-login'>
                                <h1>第三方账号登陆</h1>
                                <div class='weixin-login'>
                                    <img src="./static/img/weixin-login.png" width="66px" height="60px">
                                </div>
                            </div>
                        </div>
                    </div>
                </transition>
            </div>
            <!-- 进入花迦 -->

            <!-- 领取优惠卷  上到下的动画框 -->
            <div>
                <div id='mask' style='z-index:102' v-if='offQuan'></div>
                <transition enter-active-class='animated bounceInDown' leave-active-class='animated bounceOutUp'>
                    <div class='quan-info-wrap' v-if='offQuan'>
                        <div class='quan-info'>
                            <img src="./static/img/index-voucher-bg.png" class='quan-posi' width='100%' height="100%">
                            <p class='vouch-info-posi'>满100减1000</p>
                            <p class='vouch-intro-posi'>这可是好东西哦</p>
                            <p class='vouch-rule-posi'>了解详情</p>
                            <div class='vouch-btn-posi' @click='getQuan'>
                                <img src="./static/img/voucher-btn.png" width="168px" height="65px">
                            </div>
                            <img @click='offQuan=false;' src="./static/img/close-voucher.png" width="50px" height="50px" class='vouch-close-posi'>
                        </div>
                    </div>
                </transition>
            </div>
            <!-- 领取优惠卷  上到下的动画框 -->

            <div class="banners">
                <div class="swiper-container swiper-container-horizontal">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide" v-for='(val,index) in 10' :key='index'>
                            <div class="image-wrap"><img src="./static/img/52d12d141501ffef4d530bef20768d7e.jpg"></div>
                        </div>
                    </div>
                    <div class="swiper-pagination swiper-my-pag"></div>
                </div>
            </div>
            <div class="daily">
                <div class='type-all'>
                    <div>
                        <section @click='window.location.href="./goods-info.html"'>
                            <div>
                                <img src="./static/img/img-dan.png" width="40px" height="60px">
                            </div>
                            <span>鲜花</span>
                        </section>
                        <section @click='window.location.href="./goods-type.html"'>
                            <div>
                                <img src="./static/img/img-yongshenghua.png" width="48px" height="50px">
                            </div>
                            <span>永生花</span>
                        </section>
                        <section>
                            <div>
                                <img src="./static/img/img-huaping.png" width="48px" height="60px">
                            </div>
                            <span>花器</span>
                        </section>
                        <section>
                            <div>
                                <img src="./static/img/img-lvzhi.png" width="54px" height="60px">
                            </div>
                            <span>植物</span>
                        </section>
                    </div>
                    <div style='padding-top:42px;'>
                        <section>
                            <div>
                                <img src="./static/img/img-hunli.png" width="60px" height="45px">
                            </div>
                            <span>婚礼</span>
                        </section>
                        <section>
                            <div>
                                <img src="./static/img/img-liwu.png" width="46px" height="45px">
                            </div>
                            <span>礼物</span>
                        </section>
                        <section>
                            <div>
                                <img src="./static/img/img-huajian.png" width="40px" height="55px">
                            </div>
                            <span>花艺</span>
                        </section>
                        <section>
                            <div>
                                <img src="./static/img/img-type.png" width="50px" height="50px">
                            </div>
                            <span>全部</span>
                        </section>
                    </div>
                </div>
                <div class="daily-title">
                    <div class="daily-text bold">
                        BEAST DAILY
                    </div>
                    <div class="time">
                        <div class="time-wrap">
                            <div class="month">October</div>
                            <div class="year">2018</div>
                        </div>
                        <div class="date bold">08</div>
                    </div>
                </div>
                <index-big-goods v-for='(val,index) in bigGoods' :key='index' :big_goods='val'></index-big-goods>
            </div>
            <div class="products">
                <div style="padding:10px 0;">
                    <index-goods-title :font='goodsTitle'></index-goods-title>
                </div>
                <div class="product-wrap">
                    <div class="p-list-wrap">
                        <div v-for='(val,index) in goodsInfo' :key='index' data-v-bcd35028="" data-index="100" :class="{'list-product':true,'list-product-v2':true,'fr':index%2==0?true:false}">
                            <div data-v-bcd35028="" class="product-image">
                                <img width="100%" height="100%" :src="val.img">
                                <div data-v-bcd35028="" class="image-info"></div>
                            </div>
                            <div data-v-bcd35028="" class="brand-name brand-name-align" v-text='val.badge'>Bio-E</div>
                            <div data-v-bcd35028="" class="name" v-text='val.name'>天然柠檬麦卢卡酵素 500ml</div>
                            <div data-v-bcd35028="" class="prices price-align">
                                <div data-v-bcd35028="" class="price discount-price">
                                    <span data-v-bcd35028="" class="list-price">
                                                <span class="sign"></span>
                                    <span class="symbol symbol-align">¥</span>
                                    <span class="int" v-text='val.price.split(".")[0]'>139</span>.
                                    <span class="decimal" v-text='val.price.split(".")[1]'>0</span>
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="./static/js/com.js"></script>
    <script src="./static/js/jquery-3.3.1.min.js"></script>
    <script src="./static/layer_mobile/layer.js"></script>
    <script src='./static/js/vue.min.js'></script>
    <script src="./static/js/swiper.min.js"></script>
    <script src="./component/com/header.js"></script>
    <script src="./component/com/goodsTitle.js"></script>
    <script src="./component/home/bigGoods.js"></script>
    <script src="./component/com/goOut.js"></script>
    <script src='./static/js/vue-service-index.js'></script>
    <script>
        setTimeout(function() {
            var swiper = new Swiper('.swiper-container', {
                autoplay: {
                    delay: 2000,
                    stopOnLastSlide: false,
                    disableOnInteraction: false,
                },
                slidesPerView: 'auto',
                loopedSlides: 'auto',
                centeredSlides: true,
                spaceBetween: 50,
                pagination: {
                    el: '.swiper-pagination',
                    clickable: true,
                },
            });
        }, 600);
    </script>
</body>

</html>